<template>
	<div class="item" v-if="goods">
		<img :src="goods.goods_pic">
		<div class="detail">
			<p class="c-txt">{{goods.goods_name}}</p>
			<p class="c-txt grey">{{goods.description}}</p>
			<p class="clear">
				<span class="c-txt fl colored">￥{{goods.price}}</span>
				<span class="c-txt fr">X{{goods.goods_num}}</span>
			</p>
			<Bonus :bonus="goods.bonus"></Bonus>
		</div>
	</div>
</template>
<script>
import Bonus from '@/components/Bonus'
export default{
	name:'PayItem',
	props: ['goods'],
	components: { Bonus },
	created(){
		window.localStorage['discountPrice'] = this.goods.price_discount;
		window.localStorage['discountPoint'] = this.goods.point_discount;
	}
}
</script>
<style lang='less' scoped>
	.item{
		padding-top: .4rem;
		img{
			width: 1.6rem;
			height: 1.6rem;
			border: 1px solid #d3d3d3;
		    display: inline-block;
		    vertical-align: top;
		}
		.detail{
			width: 7rem;
		    font-size: .37rem;
		    margin-left: .3rem;
		    display: inline-block;
		    padding-bottom: .4rem;
		    border-bottom: 1px solid #d3d3d3;
		}
		.c-txt{
			font-size: .35rem;
		}
	}
</style>
